<template>
  <div class="container-fluid">
    <div class="row school-model school-tiao">
      <div class="col school-tiao-left">
        <span>{{ $route.name }}</span>
      </div>
      <div class="col-8">
        <el-select size="mini" v-model="address" placeholder="请选择">
          <el-option label="全部校区" :value="0"></el-option>
          <el-option
            v-for="(item,i) in getschooladdress"
            :key="`1businessprofile${i}`"
            :label="item.name"
            :value="item.ID"
          ></el-option>
        </el-select>
        <span class="span"></span>
        <el-date-picker
          size="mini"
          v-model="value2"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions"
        ></el-date-picker>
      </div>
      <div class="col text-center">
        <a-button @click="start"  type="primary">统计</a-button>
      </div>
    </div>
    <div class="row school-model index-model">
      <div class="col school-col-table">
        <el-tabs v-model="activeName" type="border-card">
          <el-tab-pane label="校区统计" name="1">
            <el-table :data="tableData.address" style="width: 100%">
              <el-table-column prop="date" label="序号" width="60">
                <template slot-scope="scope">{{scope.$index+1}}</template>
              </el-table-column>
              <el-table-column prop="name" label="校区名称"></el-table-column>
              <el-table-column prop="tcont" label="教师完成课时"></el-table-column>
              <el-table-column prop="scount" label="学员完成课时"></el-table-column>
              <el-table-column prop="sokcount" label="实到学员人次"></el-table-column>
              <el-table-column prop="syescount" label="应到学员人次"></el-table-column>
              <el-table-column prop="address" label="出勤率">
                <template
                  slot-scope="scope"
                >{{ scope.row.syescount?Math.floor(scope.row.sokcount /scope.row.syescount*100) +'%':0+'%' }}</template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <el-tab-pane label="班级统计" name="2">
            <el-table :data="tableData.clazz" style="width: 100%">
              <el-table-column prop="date" label="序号" width="60">
                <template slot-scope="scope">{{scope.$index+1}}</template>
              </el-table-column>
              <el-table-column prop="name" label="班级名称"></el-table-column>
              <el-table-column prop="name" label="校区名称">
                <template
                  slot-scope="scope"
                >{{scope.row.schooladdressid?getschooladdressbyid( scope.row.schooladdressid).name:""}}</template>
              </el-table-column>
              <el-table-column prop="tcont" label="教师完成课时"></el-table-column>
              <el-table-column prop="scount" label="学员完成课时"></el-table-column>
              <el-table-column prop="sokcount" label="实到学员人次"></el-table-column>
              <el-table-column prop="syescount" label="应到学员人次"></el-table-column>
              <el-table-column prop="address" label="出勤率">
                <template
                  slot-scope="scope"
                >{{ scope.row.syescount?Math.floor(scope.row.sokcount/scope.row.syescount*100) +'%':0+'%' }}</template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <el-tab-pane label="教师统计" name="3">
            <el-table :data="tableData.teacher" style="width: 100%;">
              <el-table-column prop="date" label="序号" width="60">
                <template slot-scope="scope">{{scope.$index+1}}</template>
              </el-table-column>
              <el-table-column prop="name" label="教师名称"></el-table-column>
              <el-table-column prop="name" label="校区名称">
                <template
                  slot-scope="scope"
                >{{scope.row.schooladdressid?getschooladdressbyid( scope.row.schooladdressid).name:""}}</template>
              </el-table-column>
              <el-table-column prop="tcont" label="教师完成课时"></el-table-column>
              <el-table-column prop="scount" label="学员完成课时"></el-table-column>
              <el-table-column prop="sokcount" label="实到学员人次"></el-table-column>
              <el-table-column prop="syescount" label="应到学员人次"></el-table-column>
              <el-table-column prop="address" label="出勤率">
                <template
                  slot-scope="scope"
                >{{ scope.row.syescount?Math.floor(scope.row.sokcount /scope.row.syescount*100) +'%':0+'%' }}</template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { asyncgeteducationalstatements } from "../../../../plugins/api.js";
export default {
  name: "educationalsatements",
  created() {
    this.value2 = [this.ntime.y, new Date()];
  },
  data() {
    return {
      pickerOptions: {
        shortcuts: [
          {
            text: "本周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              const w = [6, 0, 1, 2, 3, 4, 5];
              start.setTime(
                start.getTime() - 3600 * 1000 * 24 * w[start.getDay()]
              );
              end.setTime(end.getTime() + 3600 * 1000 * 24);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "本月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(
                start.getTime() - 3600 * 1000 * 24 * (start.getDate() - 1)
              );
              end.setTime(end.getTime() + 3600 * 1000 * 24);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "今年",
            onClick(picker) {
              const end = new Date();
              const start = new Date(`${end.getFullYear()}/1/1`);
              end.setTime(end.getTime() + 3600 * 1000 * 24);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      address: 0,
      starttime: "",
      starttiemtype: "年",
      activeName: "1",
      tab: {
        clazz: [],
        user: []
      },
      value2: [],
      height: 400
    };
  },
  computed: {
    ...mapGetters(["getschooladdress", "getschooladdressbyid"]),
    ntime() {
      let d = new Date();
      const y = `${d.getFullYear()}/1/1`;
      const m = `${d.getFullYear()}/${d.getMonth() + 1}/1`;
      const w =
        d.getTime() - 1000 * 60 * 60 * 24 * (d.getDay() ? d.getDay() - 1 : 6);
      return {
        y: new Date(y),
        m: new Date(m),
        w: new Date(new Date(w).toLocaleDateString())
      };
    },
    tableData() {
      const { tab } = this;
      const clazz = [];
      const address = [];
      const teacher = [];
      for (const v of tab.clazz) {
        let t1count = 0; // 教师课时
        let s1count = 0; // 学生课时
        let syes1count = 0; //学生应道
        let sok1count = 0; //学生实到
        const { schoolclazz } = v;
        for (const xv of schoolclazz) {
          let t2count = 0;
          let s2count = 0;
          let syes2count = 0;
          let sok2count = 0;
          const { schoolclazzschedule } = xv;
          for (const yv of schoolclazzschedule) {
            t2count += yv.hour;
            syes2count++;
            const { schoolclazzstudentcalendar } = yv;
            for (const zv of schoolclazzstudentcalendar) {
              s2count += zv.hour;
              sok2count++;
            }
          }
          clazz.push({
            tcont: t2count,
            scount: s2count,
            syescount: syes2count,
            sokcount: sok2count,
            ...xv
          });
          t1count += t2count;
          s1count += s2count;
          syes1count += syes2count;
          sok1count += sok2count;
        }
        address.push({
          ...v,
          tcont: t1count,
          scount: s1count,
          syescount: syes1count,
          sokcount: sok1count
        });
      }

      for (const xv of tab.user) {
        const { schoolclazzschedule } = xv;
        let t2count = 0;
        let s2count = 0;
        let syes2count = 0;
        let sok2count = 0;
        for (const yv of schoolclazzschedule) {
          t2count += yv.hour;
          syes2count++;
          const { schoolclazzstudentcalendar } = yv;
          for (const zv of schoolclazzstudentcalendar) {
            s2count += zv.hour;
            sok2count++;
          }
        }
        teacher.push({
          tcont: t2count,
          scount: s2count,
          syescount: syes2count,
          sokcount: sok2count,
          ...xv
        });
      }
      return {
        address,
        teacher,
        clazz
      };
    }
  },
  async mounted() {
    await this.start();
  },
  methods: {
    async start() {
      const [starttime, endtime] = this.value2;
      this.tab = await asyncgeteducationalstatements({
        address: this.address,
        starttime: starttime,
        endtime: endtime
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.index-model {
  margin-top: 13px;
}
.span {
  display: inline-block;
  width: 5px;
}
</style>